<!-- Create Embeddings Tab -->
<div id="tabEmbeddingsCreate" class="tab-content">
    <div class="endpoint-section" id="embeddingsCreate">
        <h2>
            <span class="endpoint-method post">POST</span>
            <span class="endpoint-path">/api/v1/embeddings - Create Embeddings</span>
        </h2>
        <p>Create embeddings with circuit breaker protection and caching.</p>

        <div class="form-group">
            <label for="embeddingsCreate_input">Input Text <span class="required">*</span>:</label>
            <textarea id="embeddingsCreate_input" rows="5" placeholder="Enter text to embed...">This is a sample text to create embeddings for semantic search and similarity matching.</textarea>
        </div>

        <div class="columns">
            <div class="column">
                <div class="form-group">
                    <label for="embeddingsCreate_model">Model:</label>
                    <select id="embeddingsCreate_model">
                        <option value="">Loading models…</option>
                    </select>
                </div>
            </div>

            <div class="column">
                <div class="form-group">
                    <label for="embeddingsCreate_encoding_format">Encoding Format:</label>
                    <select id="embeddingsCreate_encoding_format">
                        <option value="float">Float</option>
                        <option value="base64">Base64</option>
                    </select>
                </div>
            </div>
        </div>

        <button class="api-button" onclick="makeRequest('embeddingsCreate', 'POST', '/api/v1/embeddings', 'json')">
            Create Embeddings
        </button>

        <h3>cURL Command:</h3>
        <pre id="embeddingsCreate_curl">---</pre>

        <h3>Response:</h3>
        <pre id="embeddingsCreate_response">---</pre>
    </div>
</div>

<!-- Admin Tools Tab -->
<div id="tabEmbeddingsAdmin" class="tab-content">
    <div style="margin: 8px 0 12px 0; font-size: 0.95em; color: var(--text-2);">
        <strong>Runtime Env Flags</strong>
        <span class="help-tip" title="Backpressure thresholds and quotas (HTTP 429):
- EMB_BACKPRESSURE_MAX_DEPTH (default 25000)
- EMB_BACKPRESSURE_MAX_AGE_SECONDS (default 300)
- EMBEDDINGS_TENANT_RPS (multi-tenant; 0 disables)
- INGEST_TENANT_RPS (multi-tenant; fallback to EMBEDDINGS_TENANT_RPS)

Priority queues (per-stage routing):
- EMBEDDINGS_PRIORITY_ENABLED=true|false
- EMBEDDINGS_PRIORITY_WEIGHTS=high:5,normal:3,low:1

See Deployment Guide → Backpressure & Quotas for details.">?</span>
    </div>
    <div class="endpoint-section" id="embeddingsHealth">
        <div style="margin: 6px 0;">
            <span class="badge" id="dlq-badge-embedding2" title="Embedding DLQ depth">embedding: 0</span>
            <span class="badge" id="dlq-badge-chunking2" title="Chunking DLQ depth" style="margin-left:6px;">chunking: 0</span>
            <span class="badge" id="dlq-badge-storage2" title="Storage DLQ depth" style="margin-left:6px;">storage: 0</span>
            <button class="api-button" style="margin-left:8px;" onclick="embeddingsRefreshDLQBadges()">Refresh DLQ</button>
        </div>
        <div style="margin: 6px 0;">
            <span class="badge badge-info" id="hyde-status-badge" title="HYDE/doc2query status">HYDE: loading…</span>
            <button class="api-button" style="margin-left:8px;" onclick="embeddingsRefreshHydeStatus()">Refresh HYDE</button>
        </div>
        <h2>
            <span class="endpoint-method get">GET</span>
            <span class="endpoint-path">/api/v1/embeddings/health - Health Check</span>
        </h2>
        <p>Check embeddings service health with circuit breaker status.</p>

        <button class="api-button" onclick="makeRequest('embeddingsHealth', 'GET', '/api/v1/embeddings/health', 'none')">
            Check Health
        </button>

        <h3>Response:</h3>
        <pre id="embeddingsHealth_response">---</pre>
    </div>

    <div class="endpoint-section" id="embeddingsCache">
        <h2>
            <span class="endpoint-method delete">DELETE</span>
            <span class="endpoint-path">/api/v1/embeddings/cache - Clear Cache</span>
        </h2>
        <p>Clear embedding cache (admin only).</p>

        <button class="api-button btn-danger" onclick="if(confirm('Clear embedding cache?')) makeRequest('embeddingsCache', 'DELETE', '/api/v1/embeddings/cache', 'none')">
            Clear Cache
        </button>

        <h3>Response:</h3>
        <pre id="embeddingsCache_response">---</pre>
    </div>

    <div class="endpoint-section" id="embeddingsMetrics">
        <h2>
            <span class="endpoint-method get">GET</span>
            <span class="endpoint-path">/api/v1/embeddings/metrics - Service Metrics</span>
        </h2>
        <p>Get service metrics (admin only).</p>

        <button class="api-button" onclick="makeRequest('embeddingsMetrics', 'GET', '/api/v1/embeddings/metrics', 'none')">
            Get Metrics
        </button>

        <h3>Response:</h3>
        <pre id="embeddingsMetrics_response">---</pre>
    </div>

    <div class="endpoint-section" id="embeddingsStageControls">
        <h2>
            <span class="endpoint-method post">POST</span>
            <span class="endpoint-path">/api/v1/embeddings/stage/control - Stage Controls</span>
        </h2>
        <p>Pause / Resume / Drain per-stage workers (admin only).</p>
        <div class="columns">
            <div class="column">
                <div class="form-group">
                    <label for="embeddingsStage_stage">Stage:</label>
                    <select id="embeddingsStage_stage">
                        <option value="chunking">chunking</option>
                        <option value="embedding" selected>embedding</option>
                        <option value="storage">storage</option>
                        <option value="all">all</option>
                    </select>
                </div>
            </div>
            <div class="column">
                <div class="form-group">
                    <label>Actions:</label><br/>
                    <button class="api-button" onclick="embeddingsStagePause()">Pause</button>
                    <button class="api-button" onclick="embeddingsStageResume()">Resume</button>
                    <button class="api-button btn-warning" onclick="embeddingsStageDrain()">Drain</button>
                    <button class="api-button" onclick="embeddingsStageStatus()">Status</button>
                </div>
            </div>
        </div>
        <h3>Status:</h3>
        <pre id="embeddingsStage_status">---</pre>
    </div>

    <div class="endpoint-section" id="embeddingsModelsList">
        <h2>
            <span class="endpoint-method get">GET</span>
            <span class="endpoint-path">/api/v1/embeddings/models - List Embedding Models</span>
        </h2>
        <p>List available/known embedding models and which are allowed by policy.</p>

        <button class="api-button" onclick="makeRequest('embeddingsModelsList', 'GET', '/api/v1/embeddings/models', 'none')">
            List Models
        </button>

        <h3>Response:</h3>
        <pre id="embeddingsModelsList_response">---</pre>
        <div class="columns" style="margin-top:10px;">
            <div class="column">
                <h4>Allowed Providers</h4>
                <pre id="embeddingsModelsList_allowedProviders">---</pre>
            </div>
            <div class="column">
                <h4>Allowed Models</h4>
                <pre id="embeddingsModelsList_allowedModels">---</pre>
            </div>
        </div>
    </div>

    <div class="endpoint-section" id="embeddingsModelsAdmin">
        <h2>
            <span class="endpoint-method post">POST</span>
            <span class="endpoint-path">/api/v1/embeddings/models/warmup - Warmup Model (Admin)</span>
        </h2>
        <p>Preload a model into the embeddings service (admin only).</p>

        <div class="columns">
            <div class="column">
                <div class="form-group">
                    <label for="embeddingsModelsAdmin_model">Model ID <span class="required">*</span>:</label>
                    <input type="text" id="embeddingsModelsAdmin_model" placeholder="sentence-transformers/all-MiniLM-L6-v2">
                </div>
            </div>
            <div class="column">
                <div class="form-group">
                    <label for="embeddingsModelsAdmin_provider">Provider (optional):</label>
                    <input type="text" id="embeddingsModelsAdmin_provider" placeholder="huggingface">
                </div>
            </div>
        </div>

        <button class="api-button" onclick="embeddingsAdminSubmit('embeddingsModelsAdmin','/api/v1/embeddings/models/warmup')">Warmup Model</button>

        <textarea id="embeddingsModelsAdmin_payload" class="code-input" style="display:none"></textarea>

        <h3>Response:</h3>
        <pre id="embeddingsModelsAdmin_response">---</pre>
    </div>

    <div class="endpoint-section" id="embeddingsModelsDownload">
        <h2>
            <span class="endpoint-method post">POST</span>
            <span class="endpoint-path">/api/v1/embeddings/models/download - Download Model (Admin)</span>
        </h2>
        <p>Download/prepare a model (admin only). The API infers the provider if omitted.</p>

        <div class="columns">
            <div class="column">
                <div class="form-group">
                    <label for="embeddingsModelsDownload_model">Model ID <span class="required">*</span>:</label>
                    <input type="text" id="embeddingsModelsDownload_model" placeholder="sentence-transformers/all-MiniLM-L6-v2">
                </div>
            </div>
            <div class="column">
                <div class="form-group">
                    <label for="embeddingsModelsDownload_provider">Provider (optional):</label>
                    <input type="text" id="embeddingsModelsDownload_provider" placeholder="huggingface">
                </div>
            </div>
        </div>

        <button class="api-button" onclick="embeddingsAdminSubmit('embeddingsModelsDownload','/api/v1/embeddings/models/download')">Download Model</button>

        <textarea id="embeddingsModelsDownload_payload" class="code-input" style="display:none"></textarea>

        <h3>Response:</h3>
        <pre id="embeddingsModelsDownload_response">---</pre>
    </div>

    <div class="endpoint-section" id="embeddingsLedgerStatus">
        <h2>
            <span class="endpoint-method get">GET</span>
            <span class="endpoint-path">/api/v1/embeddings/ledger/status - Ledger Status</span>
        </h2>
        <p>Inspect idempotency/dedupe ledger entries (admin only).</p>

        <div class="columns">
            <div class="column">
                <div class="form-group">
                    <label for="embeddingsLedger_idemp">idempotency_key:</label>
                    <input type="text" id="embeddingsLedger_idemp" placeholder="reembed:user:media:...">
                </div>
            </div>
            <div class="column">
                <div class="form-group">
                    <label for="embeddingsLedger_dedupe">dedupe_key:</label>
                    <input type="text" id="embeddingsLedger_dedupe" placeholder="same as idempotency by default">
                </div>
            </div>
        </div>

        <button class="api-button" onclick="embeddingsQueryLedgerStatus()">Query Ledger</button>

        <h3>Response:</h3>
        <pre id="embeddingsLedgerStatus_response">---</pre>
    </div>

    <div class="endpoint-section" id="embeddingsReembedSchedule">
        <h2>
            <span class="endpoint-method post">POST</span>
            <span class="endpoint-path">/api/v1/embeddings/reembed/schedule - Schedule Re-Embed</span>
        </h2>
        <p>Schedule a re-embed expansion job for a media_id (admin only).</p>
        <div class="columns">
            <div class="column">
                <div class="form-group">
                    <label for="embeddingsReembed_media_id">media_id <span class="required">*</span>:</label>
                    <input type="number" id="embeddingsReembed_media_id" placeholder="123">
                </div>
            </div>
            <div class="column">
                <div class="form-group">
                    <label for="embeddingsReembed_priority">Priority:</label>
                    <input type="number" id="embeddingsReembed_priority" value="50" min="0" max="100">
                </div>
            </div>
        </div>
        <button class="api-button" onclick="embeddingsScheduleReembed()">Schedule Re-Embed</button>
        <h3>Response:</h3>
        <pre id="embeddingsReembed_response">---</pre>
    </div>
</div>

<!-- DLQ Admin Tab -->
<div id="tabEmbeddingsDLQ" class="tab-content">
    <div class="endpoint-section" id="embeddingsDLQ">
        <h2>
            <span class="endpoint-method get">GET/POST</span>
            <span class="endpoint-path">/api/v1/embeddings/dlq - DLQ Admin</span>
        </h2>
        <p>Inspect and requeue Dead-Letter Queue (DLQ) entries for embeddings stages (admin only).</p>

        <div style="margin: 6px 0;">
            <span class="badge" id="dlq-badge-embedding" title="Embedding DLQ depth">embedding: 0</span>
            <span class="badge" id="dlq-badge-chunking" title="Chunking DLQ depth" style="margin-left:6px;">chunking: 0</span>
            <span class="badge" id="dlq-badge-storage" title="Storage DLQ depth" style="margin-left:6px;">storage: 0</span>
            <button class="api-button" style="margin-left:8px;" onclick="embeddingsStartDLQAutoRefresh()">Auto-Refresh (10s)</button>
            <button class="api-button" onclick="embeddingsStopDLQAutoRefresh()">Stop</button>
        </div>

        <div class="columns">
            <div class="column">
                <div class="form-group">
                    <label for="embeddingsDLQ_stage">Stage:</label>
                    <select id="embeddingsDLQ_stage">
                        <option value="embedding" selected>embedding</option>
                        <option value="chunking">chunking</option>
                        <option value="storage">storage</option>
                    </select>
                </div>
            </div>
            <div class="column">
                <div class="form-group">
                    <label for="embeddingsDLQ_count">Count:</label>
                    <input type="number" id="embeddingsDLQ_count" value="50" min="1" max="500" />
                </div>
            </div>
            <div class="column">
                <div class="form-group">
                    <label for="embeddingsDLQ_job_id">Job ID Filter (optional):</label>
                    <input type="text" id="embeddingsDLQ_job_id" placeholder="job-123" />
                </div>
            </div>
        </div>

        <div class="btn-group">
            <button class="api-button" onclick="embeddingsListDLQ2()">List DLQ</button>
            <label style="margin-left:10px;">
                <input type="checkbox" id="embeddingsDLQ_selectAll" onchange="embeddingsDLQToggleSelectAll(this)" /> Select All
            </label>
            <button class="api-button" onclick="embeddingsRequeueDLQSelected()">Requeue Selected</button>
            <button class="api-button btn-warning" onclick="embeddingsRequeueDLQAllFiltered()">Requeue All Filtered</button>
        </div>

        <h3>Entries</h3>
        <div id="embeddingsDLQ_results" class="json-viewer">---</div>
    </div>
    <script>
        // Initialize DLQ auto-refresh preference
        try {
            const saved = Utils.getFromStorage('embeddings-dlq-auto-refresh');
            if (saved === true) {
                embeddingsStartDLQAutoRefresh();
            }
        } catch (e) { /* ignore */ }
    </script>
</div>
